<template>
	<div>
		<el-container>
			<el-header>
				<el-menu :default-active="activeIndex" class="myElmenu" mode="horizontal"
					background-color="#545c64" text-color="#fff" active-text-color="#ffd04b">
					<el-menu-item index="1">后台管理</el-menu-item>
					<!-- <el-menu-item index="2">关系库</el-menu-item> -->
					<!-- <el-menu-item index="3">症状库</el-menu-item>
					<el-menu-item index="4">药品库</el-menu-item>
					<el-menu-item index="5">所有用户</el-menu-item> -->
				</el-menu>
			</el-header>
			<el-container>
				<el-aside style="display: block; height: 900px;">
					<div><img src="../../assets/logo.png" style="width: 100%;"/></div>
					<el-menu default-active="1-1" class="el-menu-vertical-demo" @select="handleSelect" @open="handleOpen" @close="handleClose">
						<el-submenu index="1">
							<template slot="title">
								<i class="el-icon-location"></i>
								<span>节点</span>
							</template>
							<el-menu-item-group>
								<el-menu-item index="1-1">疾病节点</el-menu-item>
								<!-- <el-menu-item index="1-2">用户节点</el-menu-item> -->
								<el-menu-item index="1-3">其他节点</el-menu-item>
								<!-- <el-menu-item index="1-3">检查项目</el-menu-item>
								<el-menu-item index="1-4">药物节点</el-menu-item>
								<el-menu-item index="1-5">医疗科目</el-menu-item>
								<el-menu-item index="1-6">症状节点</el-menu-item>
								<el-menu-item index="1-7">在售药品</el-menu-item> -->
							</el-menu-item-group>
						</el-submenu>
						<!-- <el-submenu index="2">
							<template slot="title">
								<i class="el-icon-document"></i>
								<span slot="title">关系</span>
							</template>
							<el-menu-item-group>
								<el-menu-item index="2-1">关系修改</el-menu-item>
							</el-menu-item-group>
						</el-submenu> -->
					</el-menu>
				</el-aside>
				<el-main>
					<div style="padding-left: 40px; padding-right: 20px;padding-top: 30px;">
						<div v-if="activeIndex == '1-1'">
							<AdminDisease></AdminDisease>
						</div>
						<div v-else-if="activeIndex == '2-1'">
							<AdminRelation></AdminRelation>
						</div>
						<div v-else-if="activeIndex == '1-3'">
							<AdminOther></AdminOther>
						</div>
					</div>

				</el-main>
			</el-container>
		</el-container>
	</div>
</template>

<script>
	import AdminDisease from "../myadmin/Admindisease.vue";
	import AdminOther from "../myadmin/Adminother.vue"
	import AdminRelation from "../myadmin/Adminrelation.vue"
	export default {
		data() {
			return {
				activeIndex: '1-1',
				// navList: [
				//     { name: "/index", title: "首页", icon: "el-icon-s-home" },
				//     { name: "/user", title: "用户管理",icon:"el-icon-s-custom" },
				//   ],
			};
		},
		components: {
			AdminDisease,
			AdminOther,
			AdminRelation
		},
		mounted() {
			document.title = "后台管理"
		},
		methods: {
			handleSelect(key, keyPath) {
				console.log(key);
				this.activeIndex = key;
				// console.log(this.activeIndex);
			},
			handleOpen(key, keyPath) {
				// console.log(key, keyPath);
			},
			handleClose(key, keyPath) {
				// console.log(key, keyPath);
			}
		}
	}
</script>

<style>
	.myElmenu {
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-content: center;
		flex-wrap: nowrap;
		align-items: center;
	}
</style>